<template>
  <div
    class="test-home-container animate__faster animate__animated animate__fadeIn"
  >
    <!-- 顶部条件筛选 -->
    <div class="screen-conditions-container">
      <ScreenConditions :isDataType="false">
        <template slot="conditions">
          <AssociativeSelectGroup
            :map="selectMap"
            @conditionChange="selectGroupChange($event)"
          >
          </AssociativeSelectGroup>
        </template>
        <template slot="operate">
          <a-button type="primary" @click="search()"> 查询 </a-button>
        </template>
      </ScreenConditions>
    </div>
    <div class="test-home-body">
      <a-row :gutter="[20, 20]">
        <a-col :xs="24" :sm="12" :md="6">
          <syglWrittenReport
            :block="currentBlock"
            ref="sygl_writtenReport"
          ></syglWrittenReport>
        </a-col>
        <a-col :xs="24" :sm="12" :md="6">
          <syglUnqualifiedNumberOfReports
            :block="currentBlock"
            ref="sygl_unqualifiedNumberOfReports"
          ></syglUnqualifiedNumberOfReports>
        </a-col>
        <a-col :xs="24" :sm="12" :md="6">
          <syglUnqualifiedRate
            :block="currentBlock"
            ref="sygl_unqualifiedRate"
          ></syglUnqualifiedRate>
        </a-col>
        <a-col :xs="24" :sm="12" :md="6">
          <syglUnqualifiedTreatmentRate
            :block="currentBlock"
            ref="sygl_unqualifiedTreatmentRate"
          ></syglUnqualifiedTreatmentRate>
        </a-col>
      </a-row>
      <a-row :gutter="[20, 20]">
        <a-col :xs="24" :sm="24" :md="12">
          <syglTestSummary
            :block="currentBlock"
            ref="sygl_testSummary"
          ></syglTestSummary>
        </a-col>
        <a-col :xs="24" :sm="24" :md="12">
          <syglQualityAnalysis
            :block="currentBlock"
            ref="sygl_qualityAnalysis"
          ></syglQualityAnalysis>
        </a-col>
        <a-col :xs="24" :sm="24" :md="12">
          <syglProjectStatistics
            :block="currentBlock"
            ref="sygl_projectStatistics"
          ></syglProjectStatistics>
        </a-col>
        <a-col :xs="24" :sm="24" :md="12">
          <syglSourceAnalysis
            :block="currentBlock"
            ref="sygl_sourceAnalysis"
          ></syglSourceAnalysis>
        </a-col>
        <a-col :xs="24" :sm="24" :md="12">
          <syglIotAnalysis
            :block="currentBlock"
            ref="sygl_iotAnalysis"
          ></syglIotAnalysis>
        </a-col>
        <a-col :xs="24" :sm="24" :md="12">
          <syglunqualifiedTestList
            :block="currentBlock"
            ref="sygl_unqualifiedTestList"
          ></syglunqualifiedTestList>
        </a-col>
      </a-row>
    </div>
  </div>
</template>
<script>
import AssociativeSelectGroup from "@/components/wisdom-beam/trial-app/AssociativeSelectGroup";
import syglWrittenReport from "@/views/home/components/SYGLXT/sygl_writtenReport";
import syglUnqualifiedNumberOfReports from "@/views/home/components/SYGLXT/sygl_unqualifiedNumberOfReports";
import syglUnqualifiedRate from "@/views/home/components/SYGLXT/sygl_unqualifiedRate";
import syglUnqualifiedTreatmentRate from "@/views/home/components/SYGLXT/sygl_unqualifiedTreatmentRate";
import syglTestSummary from "@/views/home/components/SYGLXT/sygl_testSummary";
import syglQualityAnalysis from "@/views/home/components/SYGLXT/sygl_qualityAnalysis";
import syglProjectStatistics from "@/views/home/components/SYGLXT/sygl_projectStatistics";
import syglSourceAnalysis from "@/views/home/components/SYGLXT/sygl_sourceAnalysis";
import syglIotAnalysis from "@/views/home/components/SYGLXT/sygl_iotAnalysis";
import syglunqualifiedTestList from "@/views/home/components/SYGLXT/sygl_unqualifiedTestList";
export default {
  components: {
    AssociativeSelectGroup,
    syglWrittenReport,
    syglUnqualifiedNumberOfReports,
    syglUnqualifiedRate,
    syglUnqualifiedTreatmentRate,
    syglTestSummary,
    syglQualityAnalysis,
    syglProjectStatistics,
    syglSourceAnalysis,
    syglIotAnalysis,
    syglunqualifiedTestList,
  },
  data() {
    return {
      selectMap: [
        {
          type: "block",
          mode: "default",
          placeholder: "请选择检测单位",
        },
      ],
      conditionsData: {},
      currentBlock: {},
      key: 1,
    };
  },
  methods: {
    search() {
      this.$refs.sygl_writtenReport.getData();
      this.$refs.sygl_unqualifiedNumberOfReports.getData();
      this.$refs.sygl_unqualifiedRate.getData();
      this.$refs.sygl_unqualifiedTreatmentRate.getData();
      this.$refs.sygl_testSummary.getData();
      this.$refs.sygl_qualityAnalysis.getData();
      this.$refs.sygl_projectStatistics.getData();
      this.$refs.sygl_sourceAnalysis.getData();
      this.$refs.sygl_iotAnalysis.getData();
      this.$refs.sygl_unqualifiedTestList.getData();
    },
    selectGroupChange(data) {
      this.dealConditionsData(data);
      this.search();
    },
    //处理搜索区域选中值
    dealConditionsData(data = {}) {
      Object.keys(data).forEach((key) => {
        if (!data[key]) {
          this.conditionsData[key] = "";
        } else if (Array.isArray(data[key])) {
          this.conditionsData[key] = data[key]
            .map((v) => v.key)
            .filter((v) => v)
            .toString();
        } else if (
          Object.prototype.toString.call(data[key]) === "[object Object]"
        ) {
          this.conditionsData[key] = data[key].key;
        } else {
          this.conditionsData[key] = "";
        }
        this.currentBlock.orgCode = this.conditionsData.block;
      });
    },
  },
};
</script>
<style lang="less" scoped>
.test-home-container {
  padding: 0 0 10px 10px;
  height: 100%;
  .flex();
  flex-direction: column;
  .test-home-body {
    flex: 1;
    margin: 10px 10px 0 0;
    .custom-scrollbar();
    overflow-x: hidden !important;
    /deep/.ant-row {
      .ant-col {
        height: 100%;
        .writtenReport-container,
        .unqualifiedNumberOfReports-container,
        .unqualifiedRate-container,
        .unqualifiedTreatmentRate-container {
          height: 110px;
          background: #ffffff;
          box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.05);
          border-radius: 4px;
        }
        .testSummary-container,
        .qualityAnalysis-container,
        .projectStatistics-container,
        .sourceAnalysis-container,
        .iotAnalysis-container,
        .unqualifiedTestList-container {
          height: 348px;
          background: #ffffff;
          box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.05);
          border-radius: 4px;
        }
      }
    }
  }
}
</style>
